<template>
	<view>
		<view class="my-group" v-if="myGroups.length>0">
			<view class="group-name">
				<text>我的小组</text>
			</view>
			<u-cell-group>
				<u-cell v-for="(item,index) in myGroups" :key="item.groupId" :title="item.groupName" :isLink="true"
					:url="`/pages/work/supervisionGroupRecord/school-view-detail?groupId=${item.groupId} &activityId=${activityId}`"></u-cell>
			</u-cell-group>
		</view>
		<view class="other-group" v-if="otherGroups.length>0">
			<view class="group-name">
				<text>其他小组</text>
			</view>
			<u-cell-group>
				<u-cell v-for="(item,index) in otherGroups" :key="item.groupId" :title="item.groupName" :isLink="true"
					:url="`/pages/work/supervisionGroupRecord/school-view-detail?groupId=${item.groupId} &activityId=${activityId}`"></u-cell>
			</u-cell-group>
		</view>
	</view>
</template>

<script>
	import {
		myGroupList
	} from "@/api/supervise/index.js"
	export default {
		data() {
			return {
				activityId: 0,
				myGroups: [],
				otherGroups: [],

			}
		},
		onLoad(option) {
			if (Object.keys(option).length > 0) {
				const activityId = JSON.parse(decodeURIComponent(option.activityId));
				this.activityId = activityId;
				this.myGroupList();
			}
		},
		methods: {
			myGroupList() {
				myGroupList(this.activityId).then(res => {
					if (res.status === 0) {
						const list = res.list;
						this.myGroups = list.filter(item => item.myGroup)
						this.otherGroups = list.filter(item => !item.myGroup)
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.group-name {
		background-color: #B3B3B3;
		height: 6vh;
		padding: 0 10px;
		line-height: 6vh;
	}
</style>